<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns:u="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	xmlns="http://www.w3.org/1999/xhtml">

<body>
	<u:composition template="/pages/layout/pageLayout.xhtml">
		<u:define name="body">

			<h:form id="filtroForm">
				<p:panel id="panelFiltro"
					rendered="#{!pagoServicioController.addEdit}">
					<h:panelGrid columns="5">
						<h:outputText value="Fecha desde" />
						<p:calendar
							value="#{pagoServicioController.pagoServicioQuery.fechaDesde}"
							mode="popup" showOn="button" locale="es"
							pattern="#{msgs.common_inputDateFormat}" />

						<h:outputText value="Fecha hasta" />
						<p:calendar
							value="#{pagoServicioController.pagoServicioQuery.fechaHasta}"
							mode="popup" showOn="button" locale="es"
							pattern="#{msgs.common_inputDateFormat}" />

						<p:commandButton value="Consultar"
							actionListener="#{pagoServicioController.query}" update="form">
						</p:commandButton>
					</h:panelGrid>
				</p:panel>
			</h:form>

			<h:form id="form"
				onkeypress="if (event.keyCode == 13) { return false; }">
				<p:messages id="messages" />
				<p:dataTable id="dataTable" var="pagoServicio"
					value="#{pagoServicioController.listDM}" paginator="true" rows="10"
					paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
					rowsPerPageTemplate="5,10,15"
					rendered="#{!pagoServicioController.addEdit}"
					emptyMessage="No se encontraron registros">

					<f:facet name="header">
						<h:outputText value="#{msgs.admPagoServicio_title}" />
					</f:facet>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Nombre Cliente" />
						</f:facet>
						<h:outputText value="#{pagoServicio.cliente.nombre}" />
					</p:column>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Número de tarjeta" />
						</f:facet>
						<h:outputText value="#{pagoServicio.cliente.numeroTarjeta}" />
					</p:column>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Monto" />
						</f:facet>
						<h:outputText value="#{pagoServicio.monto}">
						</h:outputText>
					</p:column>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Fecha" />
						</f:facet>
						<h:outputText value="#{pagoServicio.fecha}">
							<f:convertDateTime pattern="#{msgs.common_showDateFormat}"
								timeZone="#{msgs.common_timeZone}" />
						</h:outputText>
					</p:column>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Comentarios" />
						</f:facet>
						<h:outputText value="#{pagoServicio.comentario}" />
					</p:column>

					<p:column>
						<f:facet name="header">
							<h:outputText value="Opciones" />
						</f:facet>
						<h:panelGrid columns="3">
							<p:commandLink actionListener="#{pagoServicioController.edit}"
								update="form filtroForm">
								<h:graphicImage url="/resource/images/edit.gif"
									title="Modificar" style="border:0px" />
							</p:commandLink>
							<h:commandLink actionListener="#{pagoServicioController.delete}"
								onclick="return confirm('¿Está seguro de eliminar el registro?');">
								<h:graphicImage url="/resource/images/delete.gif"
									title="Eliminar" style="border:0px" />
							</h:commandLink>
						</h:panelGrid>
					</p:column>

					<f:facet name="footer">
						<p:commandButton value="Agregar"
							actionListener="#{pagoServicioController.add}"
							update="form filtroForm" />

						<p:commandButton value="A PDF"
							actionListener="#{pagoServicioController.toPDF}" ajax="false" />
					</f:facet>
				</p:dataTable>


				<h:panelGrid id="panel" columns="1"
					rendered="#{pagoServicioController.addEdit}">

					<p:panel>
						<p:focus for="numeroTarjetaITA" />
						<h:panelGrid columns="4">

							<h:outputText value="Número tarjeta" />
							<p:inputText id="numeroTarjetaITA" size="30"
								disabled="#{pagoServicioController.clienteSelected}"
								value="#{pagoServicioController.numeroTarjeta}">
								<p:ajax update="form" event="change"
									actionListener="#{pagoServicioController.buscarPorNumeroTarjeta}" />
							</p:inputText>
							<h:outputText value="" />
							<h:outputText value="" />

							<h:outputText value="Cliente" />
							<p:autoComplete id="clienteAC"
								disabled="#{pagoServicioController.clienteSelected}"
								value="#{pagoServicioController.clienteSelectedView.cliente}"
								completeMethod="#{pagoServicioController.completeCliente}"
								var="cliente" itemLabel="#{cliente.nombre}"
								itemValue="#{cliente}"
								converter="com.view.converter.ClienteConverter"
								selectListener="#{pagoServicioController.handleSelect}"
								onSelectUpdate="form" size="30" immediate="true">
								<f:validateBean for="clienteAC" />
								<!-- <f:ajax event="change" render="nombre"/> -->
								<p:ajax update="nombre montoS numeroTarjetaITA" />
							</p:autoComplete>
							<h:panelGroup>
								<h:outputText id="nombre"
									value="#{pagoServicioController.clienteSelectedView.cliente.nombre}" />
								<p:commandLink
									disabled="#{!pagoServicioController.clienteSelected}"
									actionListener="#{pagoServicioController.deselecionarCliente}"
									update="form">
									<h:graphicImage url="/resource/images/delete.gif"
										title="Deseleccionar" style="border:0px" />
								</p:commandLink>
							</h:panelGroup>
							<h:message id="mcac" for="clienteAC" />

							<h:outputText value="Monto" />
							<p:spinner id="montoS"
								value="#{pagoServicioController.pagoServicioView.monto}" min="0"
								stepFactor="0.01" size="30">
								<f:validateBean for="montoS" />
							</p:spinner>
							<h:message id="mnts" for="montoS" />
							<h:outputText value="" />

							<h:outputText value="Comentario" />
							<p:inputTextarea id="comentarioITA" style="width:290px;"
								value="#{pagoServicioController.pagoServicioView.comentario}">
								<f:validateBean for="comentarioITA" />
							</p:inputTextarea>
							<h:message id="mcita" for="comentarioITA" />
							<h:outputText value="" />

						</h:panelGrid>
					</p:panel>

					<!-- ================================================== -->
					<!-- Opciones											-->
					<!-- ================================================== -->
					<h:panelGrid columns="2">
						<p:commandButton value="Guardar"
							actionListener="#{pagoServicioController.save}"
							update="form filtroForm">
						</p:commandButton>
						<p:commandButton value="Cancelar"
							actionListener="#{pagoServicioController.cancel}"
							immediate="true" update="form filtroForm">
						</p:commandButton>
					</h:panelGrid>

				</h:panelGrid>
			</h:form>
		</u:define>
	</u:composition>
</body>
</html>